<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<!-- 最新评论 -->
<div class="card-widget card-recent-post"  th:fragment="comments">
    <div class="item-headline"><i class="iconfont icon-comment-dots"></i><span>最新评论</span></div>
    <div class="aside-list" id="newcomm">
        <th:block th:if="${#strings.equals(theme.config.comments.use, 'commentWidget') }">
            <div class="aside-list-item" th:each="comment,iterStat : ${commentFinder.list(null, 1, 20)}"
                 th:with="page = ${comment.spec.subjectRef.kind == 'Post' ? postFinder.getByName(comment.spec.subjectRef.name) : null}"
                 th:if="${iterStat.index  < theme.config.sidebar.newcommentnumber}">
                <span th:text="${commentIndex}"></span>
                <a class="thumbnail" th:href="${page == null? '/' : page.status.permalink + '#comment-' + comment.metadata.name}" data-pjax-state="">
                    <img loading="lazy" alt="头像" th:src="${#strings.isEmpty(comment.owner.avatar)?'https://cravatar.cn/avatar/?d=mp':comment.owner.avatar}" data-ll-status="loading" class="entered loading">
                </a>
                <div class="content" >
                    <a class="comment" style="display: -webkit-box;-webkit-line-clamp: 2;-webkit-box-orient: vertical;overflow: hidden;"
                       th:href="${page == null? '/' : page.status.permalink + '#comment-' + comment.metadata.name}" th:title="${comment.spec.content}" th:text="${comment.spec.content}" data-pjax-state="">

                    </a>
                    <div class="name">
                        <span th:text="${comment.owner.displayName + ' / '}">stonewu / </span>
                        <time th:datetime="${#dates.format(comment.metadata.creationTimestamp, 'yyyy-MM-dd HH:mm:ss')}"></time>
                    </div>
                </div>
            </div>
        </th:block>

        <script th:if="${theme.config.comments.twikooEnable && #strings.equals(theme.config.comments.use, 'Twikoo') && not #strings.isEmpty(theme.config.comments.twikoos.envId)}">
            (()=>{
                const runTwikoo = () => {
                    const pagesize = [[${theme.config.sidebar.newcommentnumber}]];
                    const defaultpagesize = 5;
                    const finalpagesize = pagesize <= 0 ? defaultpagesize : pagesize;
                    twikoo.getRecentComments({
                        envId: "[(${theme.config.comments.twikoos.envId})]", // 环境 ID
                        // region: 'ap-guangzhou', // 环境地域，默认为 ap-shanghai，如果您的环境地域不是上海，需传此参数
                        pageSize: finalpagesize, // 获取多少条，默认：10，最大：100
                        includeReply: false // 是否包括最新回复，默认：false
                    }).then(function (res) {
                        let commenthtml = '';
                        res.forEach((items)=>{
                            commenthtml += `<div class="aside-list-item">
            <a class="thumbnail" href="${items.url + '#' + items.id}">
                <img loading="lazy" alt="dasda" src="${items.avatar}">
            </a>
            <div class="content">
                <a class="comment" style="display: -webkit-box;-webkit-line-clamp: 2;-webkit-box-orient: vertical;overflow: hidden;" href="${items.url + '#' + items.id}" title="test">
                ${items.commentText}
                </a>
                <div class="name">
                    <span>${items.nick} / </span>
                    <time datetime="${items.created}">${items.relativeTime}</time>
                </div>
            </div>
        </div>`
                        });
                        let necomm = document.querySelector('#newcomm')
                        necomm.innerHTML = commenthtml;
                        window.lazyLoadInstance && window.lazyLoadInstance.update()
                        window.pjax && window.pjax.refresh(necomm)
                    }).catch(function (err) {
                        // 发生错误
                        console.error(err);
                    });
                }
                if (typeof twikoo === 'object') {
                    runTwikoo()
                } else {
                    getScript(GLOBAL_CONFIG.source.twikoo.js).then(runTwikoo)
                }
            })();
        </script>
    </div>
</div>
</html>
